<template>
  <div class="hello"> 
    <el-button round @click="showMsgAlert">Button</el-button> 
  </div>
</template>

<script>
export default {
  name: 'HelloWorld',
  props: {
    msg: String
  },
  methods: {
      showMsgAlert() {
        this.$alert('这是一段内容', 'element-ui Alert', {
          confirmButtonText: '确定',
          cancelButtonText:'取消',
          showCancelButton: true,
          // callback: action => {
          //   this.$message({
          //     type: 'info',
          //     message: `action: ${ action }`
          //   });
          // }
        });
      }
    }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
h3 {
  margin: 40px 0 0;
}
ul {
  list-style-type: none;
  padding: 0;
}
li {
  display: inline-block;
  margin: 0 10px;
}
a {
  color: #42b983;
}
</style>
